<template>
	<view>
		<view class="sqBbsList">
			<view class="bbsListTop hasFlex">
				<view class="topContent">
					<view class="bbsTit">
						<text>置换</text>
						<text class="till">|</text>
						<!-- 30字内 -->
						<text>发大水了看法高房价的离开肥减肥了</text>
					</view>
					<view class="pubHead hasFlex alignCen">
						<!-- <image :src="getStaticFilePath('')"></image> -->
						<view class="head flexAll">
							<text class="iconfont icon-sqDefHead"></text>
						</view>
						<view>喵卡</view>
					</view>
				</view>
				<image class="bbsCover" :src="getStaticFilePath('fileimg.png')"></image>
			</view>
			<view class="bbsListBot spaceBet">
				<view class="listBotL hasFlex">
					<view class="listBotLItem alignCen" @tap="test">
						<image class="favor" v-if="!scFlag" :src="getStaticFilePath('sqFavor.png')"></image>
						<image class="favor" v-else :src="getStaticFilePath('sqFavorAct.png')"></image>
						<text>230</text>
					</view>
					<view class="listBotLItem alignCen" @tap="test1">
						<image class="favor" v-if="!favorFlag" :src="getStaticFilePath('sqsc.png')"></image>
						<image class="favor" v-else :src="getStaticFilePath('sqscAct.png')"></image>
						<text>230</text> 
					</view>
				</view>
				<view class="pubTime">2023-12-20 20:22:23</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data(){
			return{
				scFlag:false,
				favorFlag:false
			}
		},
		methods:{
			test(){
				this.scFlag = !this.scFlag;
			},
			test1(){
				this.favorFlag = !this.favorFlag;
			}
		}
	}
</script>

<style lang="scss" scoped>
	.sqBbsList{
		padding: 20rpx;
		border-radius: 16rpx;
		margin-bottom: 20rpx;
		background: #fff;
		.bbsListTop{
			margin-bottom: 15rpx;
			.topContent{
				flex: 1;
				.bbsTit{
					font-size: 28rpx;
					color: $sq-main0;
					font-weight: 600;
					.till{
						margin: 0 15rpx;
					}
				}
				.pubHead{
					font-size: 26rpx;
					color: $sq-main0;
					font-weight: 600;
					margin-top: 15rpx;
				}
				.head{
					width: 50rpx;
					height: 50rpx;
					background: #bf83ff;
					border-radius:50%;
					margin-right: 10rpx;
					.icon-sqDefHead{
						font-size: 26rpx;
						color: #fff;
					}
				}
			}
			.bbsCover{
				width: 136rpx;
				height: 136rpx;
				flex-shrink: 0;
				margin-left: 15rpx;
				background: #C0BBFA;
				border-radius: 10rpx;
			}
		}
		.bbsListBot{
			height: 60rpx;
			line-height: 60rpx;
			color: $sq-main8;
			font-size: 26rpx;
			.listBotL,
			.listBotLItem{
				flex: 1;
			}
			.favor{
				width: 32rpx;
				height: 32rpx;
				margin-right: 10rpx;
			}
			.pubTime{
				width: 260rpx;
			}
		}
	}
</style>